<template>
    <div class="modelBox">
        <div class="modelTitle">千万用户 共同选择</div>
        <div class="modelContent">用心做服务，成就行业口碑力量</div>
        <div class="modelBtn">
            <div class="btnUser backColor">
                <div class="btnPhoto"></div>
                <div class="userPhoto"></div>
            </div>
            <div class="btnUser">
                <div class="userSmall"></div>
                <div class="userSmall"></div>
            </div>
        </div>
    </div>
</template>

<script setup></script>

<style lang="less" scoped>
.modelBox {
    background: var(--white);
    padding-bottom: 140px;
    .modelBtn {
        display: flex;
        justify-content: center;
        margin-top: 60px;
    }
    .btnUser {
        width: 660px;
        height: 750px;
        border-radius: 24px;
        .userSmall {
            width: 660px;
            height: 360px;
            background: #1c1c1c;
            border-radius: 24px;
            margin-bottom: 30px;
        }
    }
    .backColor {
        background: linear-gradient(180deg, var(--blackLight) 0%, var(--black) 100%);
        margin-right: 30px;
        .btnPhoto {
            width: 600px;
            height: 400px;
            margin: auto;
            margin-top: 30px;
            background-color: var(--white);
        }
    }
}
.modelTitle {
    font-weight: 600;
    font-size: 40px;
    color: var(--black);
    line-height: 56px;
    width: 100%;
    padding-top: 140px;
    box-sizing: border-box;
    text-align: center;
}
.modelContent {
    width: 100%;
    font-weight: 400;
    font-size: 20px;
    color: var(--black);
    line-height: 28px;
    text-align: center;
    margin-top: 16px;
}
</style>
